<template>
    <div class="TextImage">
        <span v-if="Gx.IsEmpty(text) && (Gx.IsEmpty(imgs) || imgs.length == 0)">-</span>
        <span v-else-if="!Gx.IsEmpty(text) && (Gx.IsEmpty(imgs) || imgs.length == 0)">{{ text }}</span>
        <span v-else-if="Gx.IsEmpty(text) && !Gx.IsEmpty(imgs) && imgs.length > 0">
            <el-link type="primary" @click="onShowImg">查看</el-link>
        </span>
        <span v-else-if="!Gx.IsEmpty(text) && !Gx.IsEmpty(imgs) && imgs.length > 0">
            <el-link type="primary" @click="onShowImg">{{ text }}</el-link>
        </span>

        <FilePreview ref="FilePreviewRef"></FilePreview>
    </div>
</template>

<script lang="ts" setup>
import Gx from "@/gx/Gx";
import { FileExt } from "@/_gx/Types";

const props = defineProps({
    text: {
        type: [String, null],
        default: null,
    },

    imgs: {
        type: Array<FileExt>,
        default: () => [],
    },
});

//显示图片
const FilePreviewRef = ref();
const onShowImg = () => {
    let datas = Gx.GetFileExtInfoList(props.imgs);
    FilePreviewRef.value.Init(datas);
};
</script>
